<template>
	<view>
		<uni-popup ref="popupPayment" zindex class="uni-propun-con" type="bottom" :isShow="isShow"
			@maskClick="maskClick">
			<view class="popup-content"
				:style="{padding:props.tabPages?(isPhonex?'10rpx 20rpx 130rpx 20rpx':'10rpx 20rpx 100rpx 20rpx'):'10rpx 20rpx 50rpx 20rpx'}">
				<view class="flex justify-between padding-tb">
					<!-- <view class="text-bold text-xll padding-left-xs"> {{ orderType == 'meals' ? '请选择电子卡支付' : '请选择支付方式' }} </view> -->
					<view class="text-bold text-xll padding-left-xs">
						{{ props.source === 'mealCreatOrder'||props.source==='manyMeals' ? '请选择饭卡' : '请选择支付方式' }}
					</view>
					<!-- <view @tap="close" v-if="orderType !== 'meals'">
						<text class="fcon-a-close text-xl"></text>
					</view> -->
					<view class="bang_card" @click.stop="tapToBind('continue')" v-if="payDhasChild">
						<text class="fcon-Union-1"></text>
						<text>继续绑卡</text>
					</view>
				</view>
				<view class="flex flex-direction" v-if="props.source !== 'mealCreatOrder'&&props.source!='manyMeals'">
					<view class="border-none cu-bar-flex-card" style="display: flex;position: relative;"
						v-for="(item,index) in seletDeliveryPay" @click="tabSelect(index,0,'parent')" :key="index">
						<view class="prop-card" :class="{'fullw':item.flag}">
							<view class="prop-card-li new-prop-card  flex justify-between">
								<view>
									<text :class="item.icon" :style="{ color: item.color }"></text>
									<text class="prop-card-text">{{item.name}}</text>
								</view>
								<view style="position: absolute;right: 45rpx;">
									<!-- && item.flag&&props.source!='immediately' -->
									<view v-if="typeIndex==index" class="icon"><text style="color: #53A87F;"
											class="fcon-xuanzhong"></text></view>
								</view>
							</view>
							<view v-if="item.flag && item.id ==0">
								<!-- <text class="prop-card-ye">可用¥200.12，支付可享受会员价</text> typeIndex cardIndex-->
								<view class="prop-card-child flex justify-between align-center"
									:class="{borderNo: item.child.length <= 1}"
									v-for="(citem,cindex) in item.child.slice(0, 1)" :key="cindex"
									@click.stop="tabSelect(index,cindex,citem)">
									<view>
										<text v-if="citem.is_default=='5'" class="prop-default"
											:class="{cardsouding :citem.status =='-1' }">默</text>
										<text class="color-style" :class="{cardlocking : citem.status =='-1'}">
											<text>{{plusXing(citem.phone||'',3,4)}}</text>
											<text v-if="citem.status =='-1'" class="fcon-suoding posi-suoding"></text>
										</text>
									</view>
									<view class="flex justify-between">
										<text class="margin-right-xl text-lg"
											:class="{cardlocking : citem.status =='-1'}">¥{{citem.amount}}</text>
										<text class="text-xll margin-right-xs"
											:class="cardIndex == cindex && citem.status !=='-1' ? 'cuIcon-roundcheckfill':'cuIcon-round'"
											:style="{color:citem.status =='-1' ? '#d1d1d1' : ''}"></text>
									</view>
								</view>
								<uni-transition :show="showExpanded" :duration="400" :mode-class="modeExpandedClass">
									<block v-if="item.child.length>1" v-for="(citem,cindex) in item.child"
										:key="cindex">
										<view v-if="cindex>0" class="prop-card-child flex justify-between align-center"
											@click.stop="tabSelect(index,cindex,citem)">
											<view :class="{paddingzdy:hasDefCard}">
												<!-- <text v-if="citem.defaultStatue" class="prop-default">默</text> -->
												<text class=" color-style" :class="{cardlocking : citem.status =='-1'}">
													<text>{{plusXing(citem.phone||'',3,4)}}</text>
													<text v-if="citem.status =='-1'"
														class="fcon-suoding posi-suoding"></text>
												</text>
											</view>
											<view class="flex justify-between">
												<text class="margin-right-xl text-lg"
													:class="{cardlocking : citem.status =='-1'}">¥{{citem.amount}}</text>
												<text class="text-xll margin-right-xs"
													:class="typeIndex==index&&cardIndex==cindex&&citem.status !=='-1'?'cuIcon-roundcheckfill':'cuIcon-round'"
													:style="{color:citem.status =='-1' ? '#d1d1d1' : ''}"></text>
											</view>
										</view>
									</block>

								</uni-transition>
								<view v-if="item.child.length>1" class="launch" @click.stop="launch(['fade'])">
									{{showExpanded ? '收起' : '展开'}}
									<text class="text-gray cuIcon-unfold rotateStyle"
										:class="{'routerHover': showExpanded}"></text>
								</view>
							</view>
						</view>
						<view class="card-nono justify-center" v-if="!item.flag">
							<view class="card-nono-title">暂未发现饭卡</view>
							<view class="card-nono-text" @click.stop="tapToBind">
								<!-- <text class="card-nono-text-t">充800开通VIP立享会员价</text> -->
								<text class="card-nono-text-min">去绑卡<text class="lg text-gray cuIcon-right"
										style="color: #53A87F;font-size: 23rpx;margin-left: 5rpx;"></text></text>
							</view>
						</view>

					</view>
				</view>
				<!-- 套餐选择饭卡 mealCreatOrder多套 -->
				<view class="flex flex-direction" v-if="props.source === 'mealCreatOrder' || props.source=='manyMeals'">
					<view class="border-none cu-bar-flex-card" style="display: flex;position: relative;"
						v-for="(item,index) in seletDeliveryPay.slice(0, 1)" @click="tabSelect(index,0,'parent')"
						:key="index">
						<view class="prop-card" :class="{'fullw':item.flag}">
							<view v-if="item.flag && item.id ==0">
								<!-- <text class="prop-card-ye">可用¥200.12，支付可享受会员价</text> typeIndex cardIndex-->
								<view class="prop-card-child flex justify-between align-center"
									:class="{borderNo: item.child.length <= 1}"
									v-for="(citem,cindex) in item.child.slice(0, 1)" :key="cindex"
									@click.stop="tabSelect(index,cindex,citem)">
									<view>
										<text v-if="citem.is_default=='5'&&props.source != 'manyMeals'" class="prop-default"
											:class="{cardsouding :citem.status =='-1' }">默</text>
										<text class="color-style" :class="{cardlocking : citem.status =='-1'}">
											<text>{{plusXing(citem.phone||'',3,4)}}</text>
											<text v-if="citem.status =='-1'" class="fcon-suoding posi-suoding"></text>
										</text>
									</view>
									<view class="flex justify-between">
										<text class="margin-right-xl text-lg"
											:class="{cardlocking : citem.status =='-1'}">¥{{citem.amount}}</text>
										<text class="text-xll margin-right-xs"
											:class="cardIndex == cindex && citem.status !=='-1' ? 'cuIcon-roundcheckfill':'cuIcon-round'"
											:style="{color:citem.status =='-1' ? '#d1d1d1' : ''}"></text>
									</view>
								</view>
								<block v-for="(citem,cindex) in item.child" :key="cindex">
									<view v-if="cindex>0" class="prop-card-child flex justify-between align-center"
										@click.stop="tabSelect(index,cindex,citem)">
										<view :class="{paddingzdy:props.source != 'manyMeals'&&hasDefCard}">
											<!-- <text v-if="citem.defaultStatue" class="prop-default">默</text> -->
											<text class=" color-style" :class="{cardlocking : citem.status =='-1'}">
												<text>{{plusXing(citem.phone||'',3,4)}}</text>
												<text v-if="citem.status =='-1'"
													class="fcon-suoding posi-suoding"></text>
											</text>
										</view>
										<view class="flex justify-between">
											<text class="margin-right-xl text-lg"
												:class="{cardlocking : citem.status =='-1'}">¥{{citem.amount}}</text>
											<text class="text-xll margin-right-xs"
												:class="typeIndex==index&&cardIndex==cindex&&citem.status !=='-1'?'cuIcon-roundcheckfill':'cuIcon-round'"
												:style="{color:citem.status =='-1' ? '#d1d1d1' : ''}"></text>
										</view>
									</view>
								</block>
							</view>
						</view>
						<view class="card-nono justify-center" v-if="!item.flag">
							<view class="card-nono-title">暂未发现饭卡</view>
							<view class="card-nono-text" @click.stop="tapToBind">
								<!-- <text class="card-nono-text-t">充800开通VIP立享会员价</text> -->
								<text class="card-nono-text-min">去绑卡<text class="lg text-gray cuIcon-right"
										style="color: #53A87F;font-size: 23rpx;margin-left: 5rpx;"></text></text>
							</view>
						</view>

					</view>

				</view>
			</view>
		</uni-popup>
		<cardInput ref="pswModal" @confirm="cardPayAction"></cardInput>、
		<dinePay ref="popdinePay" @confirm="dinePayAuto"></dinePay>
	</view>
</template>

<script setup lang="ts">
	import { ref, computed, onMounted, nextTick } from 'vue'
	import mApi from "@/utils/mapi";
	import { showLoading, hideLoading, plusXing, mnavTo, getSystemPhoneX } from '@/utils/helper';
	// import { onShow } from "@dcloudio/uni-app";
	import { takeCardPay, getCardList, wx_Payment, billDetail } from '@/api/vmeitime-http/index.js';
	import dinePay from '@/components/dinePay/dinePay.vue';

	const props = defineProps({
		// list: {
		// 	type: Object,
		// 	default: () => {
		// 		return {
		// 			money: 0
		// 		};
		// 	},
		// },
		// orderType:{
		//   type:String,
		//   default:''
		// },

		totalPayPrice: {
			type: Number || String,
			default: 0
		},
		carNumber: {
			type: Number || String,
			default: 0
		},
		isShow: {
			type: Boolean,
			default: false
		},
		source: {
			// mealCreatOrder-开通套餐，immediately-待支付订单
			type: String,
			default: ''
		},
		vbillid: {
			// type: Number||String,
			default: ''
		},
		tabPages: {
			type: Boolean,
			default: false
		}
	});
	const emit = defineEmits(['maskClick', 'change', 'paySuccess'])
	const popupPayment = ref();
	const payDhasChild = ref(false);
	const pswModal = ref();
	const nowPayInfo = ref();
	const isPhonex = ref<any>(false);
	const popdinePay = ref(null);
	const hasDefCard = ref(false);
	// const carNumberIndex = ref(null)
	const initCards = (source : any = '') => {

		return new Promise(async (resolve, reject) => {
			try {
				loadStates.value = true
				source == 'open' && showLoading()
				seletDeliveryPay.value[0].child = [];
				seletDeliveryPay.value[0].flag = false;
				let defCardId = '';
				if (props.source === 'manyMeals') {
					typeIndex.value = 0;
					let bres = await billDetail({ vbill_id: props.vbillid });
					defCardId = bres.object && bres.result && bres.object.sxpDdx ? bres.object.sxpDdx.card_no || '' : '';
				}
				
				let res = await getCardList();
				let nres = res.object || [];
				seletDeliveryPay.value[0].flag = nres.length > 0;
				source == 'open' && hideLoading()
				if (res.result && res.object) {
					let defIndex = nres.findIndex(item => item.is_default == '5');
					hasDefCard.value = defIndex>=0;//是否有默认电子卡
					let nindex = nres.findIndex(item => ((props.source == 'manyMeals' && defCardId) ? item.card_no == defCardId : item.is_default == '5'));
					// 约餐-开通套餐卡已解绑,默认选中
					if(props.source == 'manyMeals'){
						nindex<0?nindex = defIndex:'';
						nindex<0&&nres.length>0?nindex = 0:'';
						defCardId && nindex >= 0 ? cardIndex.value = 0 : '';
					}
					nindex<0&&nres.length>0?nindex = 0:'';//开卡无默认电子卡且有卡
					console.log('idtccddd', nindex, defCardId)
					if (nindex > 0) {
						const citem = nres.splice(nindex, 1);
						// 将移除的元素添加到数组的第一个位置
						nres.unshift(citem[0]);
						props.source == 'manyMeals'||props.source == 'mealCreatOrder' ? nindex = 0 : '';
					}
					seletDeliveryPay.value[0].child = nres;
					props.source === 'mealCreatOrder' ? typeIndex.value = 0 : '';
					// props.source=='immediately'+++

					// const isPageShown = uni.getStorageSync('isPageShown');
					// if ( props.source=='manyMeals'&&defCardId && isPageShown) {  //随心配 已开卡
					// 	let cindex = nres.findIndex(item => item.card_no === defCardId);
					// 	cardIndex.value = cindex>=0?cindex:0;
					// 	typeIndex.value = 0
					// 	uni.removeStorageSync('isPageShown');
					// }
					// console.log(carNumberIndex.value, '卡的位置--------------------')

					payDhasChild.value = seletDeliveryPay.value[0].child.length > 0 ? true : false;
					// 开卡默认选中
					if (props.source === 'mealCreatOrder' && nindex >= 0) {
						cardIndex.value = nindex;
					}
					
					source == 'open' && popupPayment.value.open();
					let r = null;
					if (nindex >= 0) {
						r = {
							name: seletDeliveryPay.value[0].name + ('（' + plusXing(nres[nindex].phone || '', 4, 4) + '）'),
							pay_no: seletDeliveryPay.value[0].pay_no,
							cardId: nres[nindex].card_no || '',
							phone: nres[nindex].phone || '',
							money: Number(nres[nindex].amount || '0')
						}
					}
					console.log('idtccddd+++11', r)
					resolve(r)
				} else {
					mApi.msg(res.shortMessage || '网络繁忙，请稍后...');
					resolve('');
				}
			} catch (err) {
				source == 'open' && hideLoading()
				reject(err);
			}
		});
		// loadStates.value = true
		// source == 'open' && showLoading()
		// seletDeliveryPay.value[0].child = [];
		// seletDeliveryPay.value[0].flag = false
		// try {
		// 	let res = await getCardList()
		// 	let nres = res.object || [];
		// 	seletDeliveryPay.value[0].flag = nres.length > 0;
		// 	source == 'open' && hideLoading()
		// 	if (res.result && res.object) {
		// 		let nindex = nres.findIndex(item => item.is_default == '5')
		// 		if (nindex > 0) {
		// 			const citem = nres.splice(nindex, 1);
		// 			// 将移除的元素添加到数组的第一个位置
		// 			nres.unshift(citem[0]);
		// 		}
		// 		seletDeliveryPay.value[0].child = nres;
		// 		// props.source=='immediately'+++
		// 		payDhasChild.value = seletDeliveryPay.value[0].child.length > 0 ? true : false
		// 		source == 'open' && popupPayment.value.open();
		// 	}
		// } catch (e) {
		// 	source == 'open' && hideLoading()
		// }
	}
	const tapToBind = (source:any='') => {
		popupPayment.value.close()
		if(source=='continue'){
			mnavTo(props.source === 'mealCreatOrder'||props.source==='manyMeals' ? '/pages/user/bindingCards/bindingCards?orderType=meals' : '/pages/user/bindingCards/bindingCards')
		}else{
			mnavTo('/pages/user/mycard/mycard?source=payModal')
		}
	}
	//选择支付方式
	const seletDeliveryPay = ref<any>([
		{
			id: 0,
			name: '饭卡',
			pay_no: '8',
			status: true,
			flag: false,   //false没有电子卡   true有电子卡
			icon: 'fcon-dianzika',
			color: '#4988FD',
			child: [
				// {
				// 	id: 0,
				// 	text: '卡1',
				// 	cardNumber: '138***2271',
				// 	pic: 666,
				// 	select: false,
				// 	defaultStatue: true,
				// },
				// {
				// 	id: 1,
				// 	text: '卡2',
				// 	cardNumber: '138***2271',
				// 	pic: 999,
				// 	select: false,
				// 	defaultStatue: false,
				// },
				// {
				// 	id: 2,
				// 	text: '卡3',
				// 	cardNumber: '138***2271',
				// 	pic: 777,
				// 	select: false,
				// 	defaultStatue: false,
				// },
				// {
				// 	id: 3,
				// 	text: '卡4',
				// 	cardNumber: '138***2271',
				// 	pic: 888,
				// 	select: false,
				// 	defaultStatue: false,
				// }
			]
		},
		{
			id: 1,
			name: '微信',
			pay_no: '3',
			flag: true,  //默认true
			status: false,
			icon: 'fcon-weixin',
			color: '#04AE0F'
		}
	])
	const showExpanded = ref(null) //展示更多
	const modeExpandedClass = ref() //展示更多菜品	
	const cardIndex = ref(null)
	const typeIndex = ref(1)
	const loadStates = ref(false)
	onMounted(() => {
		isPhonex.value = getSystemPhoneX();
	})
	//确认自动约餐
	const dinePayAuto = (param : any) => {
		console.log(param.statue)
	}
	// 选中的电子卡
	const tabSelect = (index : number, cindex : number, item : any) => {
		let citem : Record<string, any> = {}, pitem = seletDeliveryPay.value[index];
		let fitem = seletDeliveryPay.value[index] && seletDeliveryPay.value[index].child && seletDeliveryPay.value[index].child.length > 0 ? seletDeliveryPay.value[index].child : [];
		if (item == 'parent') {
			citem = index == 0 && fitem[cindex] ? fitem[cindex] : {};
		} else {
			citem = item
		}
		console.log('tabSelect', seletDeliveryPay.value, seletDeliveryPay.value[index], index, citem)
		if (citem.status == '-1') {
			mApi.msg("该卡已锁，无法选择，请先去门店解锁！")
			return
		}
		if (props.source !== 'mealCreatOrder' && index == 0 && citem.amount < props.totalPayPrice) {
			mApi.msg('您的饭卡余额不足哦！')
			return
		}
		if (!pitem.flag) {
			return
		}
		// // 套餐相关  自动约餐扣款弹窗
		// if (props.source == 'mealCreatOrder') {
		// 	openDinePay()
		// }
		typeIndex.value = index;
		cardIndex.value = pitem.id == 1 ? null : cindex;
		// 待支付订单
		if (props.source == 'immediately') {
			// 待支付-电子卡支付
			if (index == 0) {
				console.log('商品详情的电子卡支付')
				let r = {
					name: pitem.name + (index == 0 && citem.phone ? '（' + plusXing(citem.phone || '', 4, 4) + '）' : ''),
					pay_no: pitem.pay_no,
					cardId: citem.card_no || '',
					phone: citem.phone || '',
					money: Number(citem.amount || '0')
				}
				nowPayInfo.value = r
				if (r.pay_no == '8') {
					// submitData.value.totalPayPrice === 0 ? navToNextPage() : showPop('pswModal', { totalPayMoney: submitData.value.totalPayPrice })
					props.totalPayPrice === 0 ? mApi.msg("饭卡余额不足") : pswModal.value.open({ totalPayMoney: props.totalPayPrice })
					close()
					return
				}
				// 暂未添加微信支付
				// navToNextPage();

				// close()
				return
			} else {
				// 待支付-微信支付
				console.log('微信支付')
				typeIndex.value = index
				wxPay(props.vbillid)
				close()
				return
			}
		}
		console.log(item.amount, props.totalPayPrice)
		let r = {
			name: pitem.name + (index == 0 && item.phone ? '（' + plusXing(citem.phone || '', 4, 4) + '）' : ''),
			pay_no: pitem.pay_no,
			cardId: citem.card_no || '',
			phone: citem.phone || '',
			money: Number(citem.amount || '0')
		}
		emit('change', r)
		close()
	}
	//微信支付
	const wxPay = async (billId : any = '') => {
		let res = await wx_Payment({ merOrderId: billId });
		if (!res.result || !res.object) {
			mApi.msg(res.shortMessage || '支付失败');
			close();
			return
		}
		const nres = res.object || {};
		const { nonceStr, paySign, signType, timeStamp } = nres;
		wx.requestPayment({
			provider: 'wxpay',
			timeStamp: timeStamp || '',
			nonceStr: nonceStr || '',
			package: nres.package || '',
			signType: signType || '',
			paySign: paySign || '',
			success: function (res) {
				console.log('支付成功');
				emit('paySuccess')
			},
			fail: function (err) {
				// navToNextPage('psw')
				console.log('支付失败', err);
			}
		});
	}
	const takeCardAct = () => {

	}
	// 跳转
	// const navToNextPage = (source : any = '') => {
	// 	// '/pages/order/orderDetails/orderDetails?vbill_id=' + item.vbill_id  + '&activeType=' + '' + '&type=' + '1' + '&needInvoiceId=' + item.needInvoiceId
	// 	let url = source == 'psw' ? `/pages/order/orderDetails/orderDetails?vbill_id=${curOrderId.value}&activeType=${isSpoType.value ? 'pindan' : ''}&type=${selecDlvType.value.id}` :
	// 		`/pages/order/orderSuccess/orderSuccess?vbill_id=${curOrderId.value}&payAmount=${submitData.value.totalPayPrice}&orderType=${isSpoType.value}`
	// 	console.log('navToNextPage', url)
	// 	uni.redirectTo({
	// 		url: url
	// 	});
	// }
	const launch = (type : any) => {
		modeExpandedClass.value = type
		showExpanded.value = !showExpanded.value
	}
	const open = () => {
		if (props.source == 'immediately') {
			typeIndex.value = null;
			cardIndex.value = null;
		}
		initCards('open')
	}

	const maskClick = (e : any) => {
		emit('maskClick')
	}
	const close = () => {
		popupPayment.value.close()
	}

	// 电子卡支付
	const cardPayAction = async (psw : any) => {
		// let mcardId = that.memberInfo && that.memberInfo.cardno && that.memberInfo.cardno != memberDetails.vcard ?
		// 	that.memberInfo.cardno : memberDetails.vcard;
		// let payMoney = that.PayActivityData.activityPrice ? that.PayActivityData.activityPrice : that.submitData
		// 	.totalPayPrice;
		const cardPayData = {
			cardId: nowPayInfo.value.cardId,
			billId: props.vbillid,
			pay_no: nowPayInfo.value.pay_no,
			pswd: psw,
			money: props.totalPayPrice
		};
		showLoading({ title: '正在支付...' });
		try {
			let res = await takeCardPay(cardPayData)
			if (res.result) {
				// navToNextPage()
				// mApi.msg("订单支付成功")
				hideLoading();
				emit('paySuccess')
			} else {
				hideLoading();
				uni.showModal({
					title: '提示',
					content: res.shortMessage || '支付结果查询异常',
					confirmText: '知道了',
					showCancel: false,
					success(res) {
						pswModal.value.open({ totalPayMoney: props.totalPayPrice })
					}
				})
				if (res.shortMessage.indexOf('将锁卡') != -1) { //头两次密码输入错误
					// that.password = '';
					// that.actOrderPayed = false;
					pswModal.value.initData()
				} else { //输错三次卡被锁
					// setTimeout(() => {
					// 	uni.redirectTo({ url: '../wait_payment/wait_payment' });
					// }, 2000);
				}
			}
		} catch (e) {
			hideLoading();
		}


	}

	const openDinePay = () => {
		popdinePay.value?.open()
	}

	const cloneDinePay = () => {
		popdinePay.value?.close()
	}

	defineExpose({ open, close, maskClick, initCards, wxPay })
</script>

<style lang="scss" scoped>
	.fcon-suoding {
		color: #d1d1d1;
		margin-right: 10rpx;
	}

	.posi-suoding {
		position: absolute;
		right: -35rpx;
		top: -5rpx;
		font-size: 25rpx;
	}

	.cardlocking {
		color: #d1d1d1 !important;
	}

	.bang_card {
		color: #2CAC58;
		font-size: 32rpx;
		font-family: "Microsoft YaHei UI";

		.fcon-Union-1 {
			font-size: 32rpx;
			margin-right: 10rpx;
		}
	}

	.popup-content {
		width: 750rpx;
		border-radius: 16rpx 16rpx 0 0;
		padding: 10rpx 20rpx 50rpx 20rpx;
		background-color: #fff;
	}

	.cu-bar-flex-card {
		padding: 0rpx 23rpx !important;
		border-radius: 10px;
		margin-bottom: 30rpx;
		background: #FFF;
		box-shadow: 0px 2px 18px 0px rgba(0, 0, 0, 0.08);
	}

	.prop-card {
		.new-prop-card {
			border-bottom: 1px solid #F3F3F3;
			padding: 40rpx 20rpx 40rpx;

			&:last-child {
				border: none;
			}
		}

		.borderNo {
			border: none !important;
		}

		.prop-card-child {
			padding: 40rpx 15rpx 40rpx 18rpx;
			border-bottom: 1px solid #F3F3F3;

			.paddingzdy {
				margin-left: 40rpx;
			}

			.color-style {
				color: #666;
				font-family: "Microsoft YaHei UI";
				font-size: 32rpx;
				font-weight: 400;
				position: relative;
			}
		}

		.cardsouding {
			color: #fff !important;
			background-color: #d1d1d1 !important;
			;
		}

		.prop-default {
			color: #53A87F;
			font-family: "Microsoft YaHei UI";
			font-size: 28rpx;
			font-style: normal;
			line-height: normal;
			border-radius: 4px;
			background: rgba(86, 191, 122, 0.28);
			display: inline-block;
			width: 40rpx;
			height: 40rpx;
			text-align: center;
			line-height: 40rpx;
			margin-right: 10rpx;
		}

		.prop-card-li {
			display: flex;
			align-items: center;

			&:last-child {
				// padding:20rpx 0;
				padding: 40rpx 20rpx 40rpx 20rpx;
			}
		}

		.prop-card-text {
			margin-left: 20rpx;
			font-size: 32rpx;
		}

		.prop-card-ye {
			font-size: 24rpx;
			margin-top: 10rpx;
			font-weight: 400;
		}
	}

	.launch {
		color: #666;
		font-family: "Microsoft YaHei UI";
		font-size: 24rpx;
		font-weight: 400;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 20rpx 0 10rpx;

		.rotateStyle {
			display: inline-block;
			font-size: 24rpx;
			color: #666;
		}
	}

	.routerHover {
		transform: rotate(180deg);
	}

	.card-nono {
		display: flex;
		flex-direction: column;
		text-align: right;
		position: absolute;
		right: 25rpx;
		height: 100%;
		.card-nono-title {
			color: #999;
			font-size: 24rpx;
			font-weight: 400;
			letter-spacing: 0.24px;
			margin-bottom: 10rpx;
		}

		.card-nono-text-t {
			color: #FF9700;
			font-size: 28rpx;
			font-weight: 400;
			margin-right: 15rpx;
		}

		.card-nono-text-min {
			color: #56BF7A;
			text-align: center;
			font-size: 28rpx;
			font-weight: 400;
		}
	}

	.cuIcon-roundcheckfill {
		color: $base-color;
	}
</style>